Ext.require([
    'AM.service.ResizePage',
    'AM.util.URL'
]);


// 父容器 相对，子元素绝对，靠控制zIndex显示
Ext.define('AM.service.PlayCSS', {


    singleton:true,


    createWorkSpace:function () {
        var index = ppt.index;
        var pages = [];
        var len = ppt.view.workspace.items.length;
        var ww = ppt.view.workspace.getWidth();
        var wh = ppt.view.workspace.getHeight();
        var times = screen.width / ww;

        ppt.view.playWorkspace = Ext.widget('panel', {
            renderTo:Ext.getBody(),
            id:'play-workspace',
            width:screen.width,
            height:screen.height
        });
        ppt.view.playWorkspace.body.setStyle('position', 'relative')
        ppt.view.playPages = pages;

        // prepare dom
        for (var i = 0; i < len; i++) {
            var dom = AM.service.ResizePage.getPlayDom(i, times);
            pages.push(dom);

            dom.id = 'play-dom-' + i;
            dom.style.position = 'absolute';
            dom.style.display = 'block';
            dom.style.margin = 'auto';
            dom.style.left = ww * (times - 1) / 2 + 'px';
            dom.style.top = wh * (times - 1) / 2 + 'px';
            ppt.view.playWorkspace.body.dom.appendChild(dom);

            // handle subject element
            var el = Ext.get(dom);
            el.select('div[id^=play-xbxText]').setStyle('border', 'none');
            el.select('div[id^=play-xbx]').setStyle('resize', 'none');
            el.select('audio,video').addListener('click', function (e) {
                e.stopPropagation()
            });
            el.select('a').addListener('click', function (e, el) {
                e.stopEvent();
                var href = el.href;
                var pageIndex = href.substring(href.indexOf('(') + 1, href.indexOf(')'));
                var pageIndex = parseInt(pageIndex);
                AM.service.PlayCSS.go(pageIndex);
            })

        }
    },


    begin:function (startIndex) {
        ppt.index = startIndex;

        AM.service.PlayCSS.createWorkSpace();
        ppt.view.playWorkspace.el.dom.webkitRequestFullScreen();
        ppt.view.playWorkspace.el.dom.addEventListener('webkitfullscreenchange', function () {
            if (document.webkitIsFullScreen) {
                ppt.view.playWorkspace.el.on('click', AM.service.PlayCSS.next);
            } else {
                AM.service.PlayCSS.end();
            }
        }, true);
        ppt.view.playPages[startIndex].style.zIndex = 10;
    },


    end:function () {
        ppt.view.playWorkspace.close();
    },


    next:function () {
        if (ppt.index == ppt.view.playPages.length - 1) {
            alert('已经是最后一页，单击返回');
            AM.service.PlayCSS.end();
            return;
        }
        var curPage = ppt.view.playPages[ppt.index++];
        var nextPage = ppt.view.playPages[ppt.index];


        // 显示动画
        curPage.style.zIndex = 9;
        nextPage.style.zIndex = 10;
        nextPage.style.webkitAnimation = ppt.view.workspace.items.get(ppt.index).animName + ' 0.8s linear';

        // 切换声音
        var nextPage_cmp = ppt.view.workspace.items.get(ppt.index);
        var cutOverAudioName = nextPage_cmp.cutOverAudioName;
        var audio = Ext.DomHelper.createDom({
            tag: 'audio',
            src : AM.util.URL.cutOverAudio + cutOverAudioName
        })
        audio.play();
    },


    prev:function () {
        var prevIndex = ppt.index - 1;
        if (prevIndex < 0) {
            alert('已经是第一页了');
            return;
        }
        AM.service.PlayCSS.go(ppt.index - 1);
    },


    go:function (index) {
        ppt.view.playPages[ppt.index].style.zIndex = 9
        ppt.view.playPages[index].style.zIndex = 10;
        ppt.index = index;
    }


})